<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2018/3/5
  Time: 9:31
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@include file="common/tag.jsp"%>
<html>
<head>
    <title>Title</title>
    <%@include file="common/head.jsp" %>
</head>
<body>

<table class="table table-hover">
    <caption>
        <button type="button" class="btn btn-primary" class="btn" name="ruleId" onclick="window.location.href='${ctx}/rule/toAddRule'">添加规则</button>
    </caption>
    <thead>
    <tr>
        <td colspan="7" align="center" >规则列表</td>
    </tr>
    <tr>
        <th>源ip</th>
        <th>源端口</th>
        <th>目的ip</th>
        <th>目的端口</th>
        <th>类型</th>
        <th>状态</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
        <%--<form action="<c:url value='${ctx}/rule/deleteRule'/>" method="post">--%>
            <c:forEach var="rule" items="${ruleList}">
                <tr>
                    <td>${rule.src_ip}</td>
                    <td>${rule.src_port}</td>
                    <td>${rule.dst_ip}</td>
                    <td>${rule.dst_port}</td>
                    <td>${rule.pro}</td>
                    <td><input name="status" type="checkbox" data-size="small" value="${rule.id}"<c:if test="${rule.isValid}">checked</c:if>></td>
                    <td colspan="2">
                        <button class="btn" name="ruleId" value="${rule.id}" onclick="window.location.href='${ctx}/rule/deleteRule/${rule.id}'">删除</button>
                        <button class="btn" name="ruleId" onclick="window.location.href='${ctx}/rule/mapPlus/${rule.id}'">详情</button>
                    </td>
                </tr>
            </c:forEach>
        <%--</form>--%>
    </tbody>
</table>
</body>

<script type="text/javascript" src="${ctx }/assets/bootstrap-switch/bootstrap-switch.min.js"></script>
<link rel="stylesheet" type="text/css" href="${ctx }/assets/bootstrap-switch/bootstrap-switch.min.css" />
<pre name="code" class="html"/>
<script type="text/javascript">
    $('[name="status"]').bootstrapSwitch({
        onText:"启动",
        offText:"停止",
        onColor:"success",
        offColor:"info",
        size:"small",
        onSwitchChange:function(event,state){
            var params = {};
            params.ruleId = $(this).val() ;
            params.bool = state ;
                $.ajax({
                    contentType : "application/json",
                    type : "GET",
                    url : "/rule/updateRule",
                    data: params ,
                    dataType : "json",
                    success : function(data) {
                        alert(data);
                    }
                });
        }
    })

</script>
</html>
